import { connect } from 'dva'
import styles from './risk.scss'
import { Checkbox } from 'antd';
import { Progress, Button } from 'antd-mobile';

const CheckboxGroup = Checkbox.Group;
const RiskSubject = ({
  dispatch,
  subjects,
  selectPage
}) => {
  //选择题目
  let selectItems = []
  let selectSub = (checkedValues) => {
    selectItems = checkedValues
    if (selectPage == subjects.length - 1) {
      return
    }
    if (subjects[selectPage].unique) {
      setTimeout(() => {
        dispatch({
          type: 'riskEvaluate/changeSubject',
          payload: {
            selectPage: (selectPage += 1)
          }
        })
      },400)
    }
  }
  let toPrePage = () => {
    dispatch({
      type: 'riskEvaluate/changeSubject',
      payload: {
        selectPage: (selectPage -= 1)
      }
    })
  }
  //多选下一页
  let toNextPage = () => {
    if (selectPage == subjects.length -1) {
      alert(selectItems)
      dispatch({
        type: "modules/getModules",
        payload: {
          pathname: "",
          businessId: "1231241227-r",
          process: "riskEvaluate",
          title: "风险评测"
        }
      })
      dispatch({
        type: 'riskEvaluate/changeSubject',
        payload: {
          selectPage: 0
        }
      })
    } else {
      dispatch({
        type: 'riskEvaluate/changeSubject',
        payload: {
          selectPage: (selectPage += 1)
        }
      })
    }
  }
  //分线评测题目
  // let subjects = 
  //选择选项
  // let selectPage = 0;
  let subjectDom = subjects[selectPage]
  //button
  let PageButton = () => {
    let val
    let flag = selectPage == subjects.length -1
    flag ? val = '确认并提交' : val = '下一步'
    if (flag) {
      return (
        <div className={styles.myButton}> 
          <Button type="primary" onClick={toNextPage}>{val}</Button>
        </div>
      )
    }
    if (!subjectDom.unique || subjectDom.disabled) {
      if (subjectDom.disabled) {
        return (
          <div className={styles.myButton}>
            <Button type="primary" onClick={toNextPage}>{val}</Button>
            <div className={styles.tips}>本题已根据补充资料里的学历信息进行自动匹配，请点击“下一题”继续答题</div>
          </div>
        )
      } else if (!subjectDom.unique) {
        return (
          <div className={styles.myButton}>
            <Button type="primary" onClick={toNextPage}>{val}</Button>
            <div className={styles.tips}>此题为多选题，答题后请点击“下一题”继续答题</div>
          </div>
        )
      }
    }else{
      return null
    }
  }
  return (
    <div className={styles.riskContain}>
      <div className={styles.subject}>
        <div className={styles.title}>{subjectDom.title}</div>
        <div className={styles.topic}>
          <CheckboxGroup disabled={subjectDom.disabled} defaultValue={['406']} options={subjectDom.subject} onChange={selectSub}></CheckboxGroup>
        </div>
        <Progress percent={(selectPage+1)/5*100} position="normal" appearTransition />
        <div className={styles.subPageTip}>
          <div><span>{selectPage+1} / </span>{subjects.length}</div>
        </div>
        <PageButton></PageButton>
      </div>
    </div>
  )
}


export default connect((state) => state.riskEvaluate )(RiskSubject)

